import { useEffect } from 'react';

const useClickOutside = <T extends HTMLElement>(ref: T, hide: () => void): void => {
    useEffect(() => {
        const handleClickOutside = (event: Event) => {
            if (ref && !ref.contains(event.target as HTMLDivElement)) {
                hide();
            }
        };

        document.addEventListener('mousedown', handleClickOutside);
        return () => {
            document.removeEventListener('mousedown', handleClickOutside);
        };
    }, [ref, hide]);
};

export default useClickOutside;
